import Vue from 'vue'

import Cookies from 'js-cookie'

import 'normalize.css/normalize.css'

import Element from 'element-ui'

// 引入vue-modal-dialogs组件
import * as ModalDialogs from 'vue-modal-dialogs'

// 数据字典
// import dict from './components/Dict'

// 权限指令
import permission from './components/Permission'
import './assets/styles/element-variables.scss'
// global css
import './assets/styles/index.scss'

import App from './App'
import store from './store'
import router from './router/routers'

import './assets/icons' // icon
import './router/index' // permission control

// 引入自定义v-scrollbar指令
// import scrollbar from './directive/scrollbar'

// 引入katex(公式渲染)
import vueKatex from 'vue-katex'
import 'katex/dist/katex.css'

// 引入vxe-table组件
import 'xe-utils'
import VXETable from 'vxe-table'
import 'vxe-table/lib/index.css'

// Vue.use(mavonEditor)
Vue.use(permission)

// Vue.use(dict)
Vue.use(Element, {
  size: Cookies.get('size') || 'small' // set element-ui default size
})

Vue.use(ModalDialogs) // No options

Vue.use(vueKatex)

Vue.use(VXETable)
// vxe-table全局参数
VXETable.setup({
  // 问题1: 点击vxe-table下拉框(vxe-select)会导致对话框出现"怪异"的偏移
  // 原因: 暂不清楚!!!
  // 解决方法: vxe-table全局参数设置transfer=true,将下拉框插入到body
  //
  // 问题2: 虽然修改了transfer参数, 但下拉框看不见
  // 原因: vxe-select的z-index是点击的时候自动生成的,其z-index值小于对话框遮罩(div.dialog-mask)的z-index,被遮住了
  // 解决方法: 将vxe-table的z-index起始值设置的更大一些!
  zIndex: 5000,
  select: {
    transfer: true
  }
})

Vue.config.productionTip = false

new Vue({
  el: '#app',
  router,
  store,
  render: h => h(App)
})
